<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Paris</title>
    <link rel="stylesheet" href="../../css/themes/default/jquery.mobile-1.3.1.min.css">
    <link rel="stylesheet" href="../../_assets/css/jqm-demos.css">
    <link rel="stylesheet" href="swipe-page.css">
    <link rel="shortcut icon" href="../../favicon.ico">
    <script src="../../js/jquery.js"></script>
    <script src="../../_assets/js/index.js"></script>
    <script src="../../js/jquery.mobile-1.3.1.min.js"></script>
    <script src="swipe-page.js"></script>
</head>
<body>

<div data-role="page" id="paris" class="demo-page" data-dom-cache="true" data-theme="a" data-prev="buenosaires"
     data-next="capetown">

    <div data-role="header" data-position="fixed" data-fullscreen="true" data-id="hdr" data-tap-toggle="false">
        <h1>Paris</h1>
        <a href="swipe-page.html" data-ajax="false" data-direction="reverse" data-icon="delete" data-iconpos="notext"
           data-shadow="false" data-icon-shadow="false">Back</a>
    </div>
    <!-- /header -->

    <div data-role="content">

        <div id="trivia-paris" class="trivia ui-content" data-role="popup" data-position-to="window"
             data-tolerance="50,30,30,30" data-theme="d">
            <a href="#" data-rel="back" data-role="button" data-theme="a" data-icon="delete" data-iconpos="notext"
               class="ui-btn-right">Close</a>

            <p>Each year, 44 million tourists visit Paris and the surrounding Ile de France region. Paris is year after
                year the most visited city in the world.
                <small>source:&nbsp;parisdigest.com</small>
            </p>
        </div>

    </div>
    <!-- /content -->

    <div data-role="footer" data-position="fixed" data-fullscreen="true" data-id="ftr" data-tap-toggle="false">
        <div data-role="controlgroup" class="control ui-btn-left" data-type="horizontal" data-mini="true">
            <a href="#" class="prev" data-role="button" data-icon="arrow-l" data-iconpos="notext" data-theme="d">Previous</a>
            <a href="#" class="next" data-role="button" data-icon="arrow-r" data-iconpos="notext"
               data-theme="d">Next</a>
        </div>

        <a href="#trivia-paris" data-rel="popup" class="trivia-btn ui-btn-right" data-role="button" data-icon="info"
           data-iconpos="left" data-theme="d" data-mini="true">Trivia</a>
    </div>
    <!-- /footer -->

</div>
<!-- /page -->

</body>
</html>
